<template>
  <div class="dd">
    <div class="scene_tips" v-if="false" :style="getPosition">
      <!-- <img src="@/images/scene_tips.png" class="img_back" /> -->
      <div class="scene_tipsall">{{ tipName }}</div>
    </div>
    <!-- <img src="@/images/indexbj.png" alt="" class="indexbj" /> -->
    <!-- 顶部 -->
    <head-main />
    <!-- task任务菜单 -->
    <div class="taskbox">
      <div
        class="taskitem tool"
        v-for="item in taskdata"
        :key="item.id"
        @click="taskid = item.id"
      >
        <img
          src="@/images/task.png"
          alt=""
          class="normal"
          v-if="taskid != item.id"
        />
        <img
          src="@/images/taskac.png"
          alt=""
          class="active taskitemimgac"
          v-if="taskid != item.id"
        />
        <img
          src="@/images/taskac.png"
          alt=""
          class="taskitemimgac"
          v-if="taskid == item.id"
        />
        <div class="taskname">{{ item.name }}</div>
      </div>
    </div>
    <!-- 步骤提示提示 -->
    <tip-text :tiptext="tiptext" v-if="tiptext" />
    <!-- 警告提示 -->
    <warn-ni :wtext="wtext" v-if="wtext" />
    <!-- 检测方法常驻 -->
    <div class="jianbox" :style="{ right: rightpx + 'px' }">
      <div class="tool jiantool" @click="ycfn">
        <img src="@/images/yc.png" alt="" class="normal" />
        <img src="@/images/ycac.png" alt="" class="active" />
      </div>
      <div class="jbox">
        <!-- 工具兰 -->
        <div class="jboxtool" :class="jbshow ? 'jboxtools jboxtool' : ''">
          <div
            class="jboxtoolitem"
            v-for="item in jboxdata"
            :key="item.id"
            @click="qhfn(item)"
            v-show="jbshow || item.id == 1"
          >
            {{ item.name }}
            <!-- <img
              src="@/images/jboxtool.png"
              alt=""
              class="jboxtoolimg"
              v-if="item.id == jcid"
              @click="jbshowfn"
            /> -->
          </div>
        </div>
        <!-- 显示文章内容 -->
        <div class="jbdesbox Scroll" v-if="bsid == 1">
          1.将一块厚20mm铝板放在照射野 中并覆盖设备的AEC电离室灵敏区
          域，调节照射野小于铝板的尺寸。 2.选择全部电离室，在自动曝光条
          件下进行曝光（若无全自动曝光条件， 则固定管电压为80kV，mAs自动）。
          重复曝光5次，每次曝光后记录管 电流时间积或DDI的显示值。
          3.如果记录的是管电流时间积，以 公式计算5次曝光后管电流时间积
          读数的重复性，如果记录的是DDI 值，则参考公式计算5次曝光后
          DDI读数的重复性。 式中： CV—变异系数，% D一n次曝光电流时间积读数
          值的平均值，单位毫安秒（mAs）； Di一曝光读取管电流时间积总 次数。

          <!-- <img src="@/images/gs1.png" alt="" class="gs1" /> -->
        </div>
      </div>
    </div>
    <!-- 常驻 -->
    <div class="tool jiantools" @click="ycfns" v-if="rightpx == -900">
      <img src="@/images/yc.png" alt="" class="normal" />
      <img src="@/images/ycac.png" alt="" class="active" />
    </div>
    <!-- 工具栏 -->
    <div class="gjtoolbox" v-if="taskids == 1">
      <div class="wpmain">
        <div
          class="wpbox"
          v-for="item in wpdata"
          :key="item.id"
          @click="wpidfn(item.id)"
        >
          <div class="tool">
            <img :src="item.src" alt="" class="wpimgitems" />
            <img
              src="@/images/wpbj.png"
              alt=""
              class="normal"
              :ref="'normalImg' + item.id"
              v-if="!wpid.includes(item.id)"
            />
            <img
              src="@/images/wpbjac.png"
              alt=""
              class="active"
              v-if="!wpid.includes(item.id)"
            />
            <img
              class="wpimgyx"
              src="@/images/wpbjac.png"
              alt=""
              v-if="wpid.includes(item.id)"
            />
          </div>
          <div class="wpname">{{ item.name }}</div>
        </div>
      </div>
      <div class="tool gjtoolqd" @click="wpqdfn">
        <img src="@/images/qd.png" alt="" class="normal" />
        <img src="@/images/qdac.png" alt="" class="active" />
        <div class="gjtoolname">确定</div>
      </div>
    </div>
    <!-- 工具栏提示 -->
    <div class="gjltsbox" v-if="gjltips != ''">
      <div class="gjlt">
        <img src="@/images/tooltips.png" alt="" class="gjltimg" />
        <img
          src="@/images/closexz.png"
          alt=""
          class="choicecloses"
          @click="gjltips = ''"
        />
        <div
          class="glcsbox"
          :class="
            gjltips == '回答错误' || gjltips == '请将SID调至100cm'
              ? 'gjltips'
              : 'gjltipss'
          "
        >
          {{ gjltips }}
        </div>
      </div>
    </div>
    <!-- 选择题 -->
    <div class="choicebox" v-if="taskids == 1.3">
      <img src="@/images/choicebj.png" alt="" class="choicebj" />
      <div class="choicetitle">单选题</div>
      <div class="choicename">1、请选择合适的探头摆放的位置（）</div>
      <div class="choicemain">
        <div class="choiceitem tool" @click="choiceidfn(1)">
          <img
            src="@/images/xx.png"
            alt=""
            class="normal choiceitemimg"
            v-if="choiceid != 1"
          />
          <img
            src="@/images/xxac.png"
            alt=""
            class="active choiceitemimg"
            v-if="choiceid != 1"
          />
          <img
            src="@/images/xxac.png"
            alt=""
            class="choiceitemimg"
            v-if="choiceid == 1"
          />
          <img src="@/images/x1.png" alt="" class="choiceitximg" />
          <div class="choiceitemname">A</div>
        </div>
        <div class="choiceitem tool" @click="choiceidfn(2)">
          <img
            src="@/images/xx.png"
            alt=""
            class="normal choiceitemimg"
            v-if="choiceid != 2"
          />
          <img
            src="@/images/xxac.png"
            alt=""
            class="active choiceitemimg"
            v-if="choiceid != 2"
          />
          <img
            src="@/images/xxac.png"
            alt=""
            class="choiceitemimg"
            v-if="choiceid == 2"
          />
          <img src="@/images/x2.png" alt="" class="choiceitximg" />
          <div class="choiceitemname">B</div>
        </div>
        <div class="choiceitem tool" @click="choiceidfn(3)">
          <img
            src="@/images/xx.png"
            alt=""
            class="normal choiceitemimg"
            v-if="choiceid != 3"
          />
          <img
            src="@/images/xxac.png"
            alt=""
            class="active choiceitemimg"
            v-if="choiceid != 3"
          />
          <img src="@/images/x3.png" alt="" class="choiceitximg" />
          <img
            src="@/images/xxac.png"
            alt=""
            class="choiceitemimg"
            v-if="choiceid == 3"
          />
          <div class="choiceitemname">C</div>
        </div>
        <div class="choiceitem tool" @click="choiceidfn(4)">
          <img
            src="@/images/xx.png"
            alt=""
            class="normal choiceitemimg"
            v-if="choiceid != 4"
          />
          <img
            src="@/images/xxac.png"
            alt=""
            class="active choiceitemimg"
            v-if="choiceid != 4"
          />
          <img src="@/images/x4.png" alt="" class="choiceitximg" />
          <img
            src="@/images/xxac.png"
            alt=""
            class="choiceitemimg"
            v-if="choiceid == 4"
          />
          <div class="choiceitemname">D</div>
        </div>
        <div class="choicefalse" v-if="choicetip == 1">回答错误，正确答案C</div>
        <div class="choicetrue" v-if="choicetip == 2">回答正确</div>
      </div>
      <img
        src="@/images/closexz.png"
        alt=""
        class="choiceclose"
        @click="taskid = 2"
      />
      <div class="tool gjtoolqds" v-if="choicetip == 0" @click="choicefn">
        <img src="@/images/qd.png" alt="" class="normal" />
        <img src="@/images/qdac.png" alt="" class="active" />
        <div class="gjtoolname">确定</div>
      </div>
      <div
        class="tool gjtoolqds"
        v-if="choicetip == 1 || choicetip == 2"
        @click="taskid = 2"
      >
        <img src="@/images/qd.png" alt="" class="normal" />
        <img src="@/images/qdac.png" alt="" class="active" />
        <div class="gjtoolname">继续</div>
      </div>
    </div>
    <!-- 打开视野灯 -->
    <div class="sybox" v-if="taskids == 2 || taskids == 2.1">
      <img src="@/images/sybj.png" alt="" class="sybjimg" />
      <img
        v-if="taskids == 2"
        src="@/images/sybjac.png"
        alt=""
        class="sybjimgac tm"
        @click="taskids = 2.1"
      />
      <div class="syboxright">
        <img src="@/images/syd.png" alt="" />
      </div>
      <div class="syboxrights" v-if="taskids == 2.1"></div>
    </div>
    <!-- 调节SID -->
    <div class="sidbox" v-if="taskids == 4">
      <img src="@/images/sidtjbj.png" alt="" class="sidtjbjimg" />
      <img src="@/images/tsidbj.png" alt="" class="tsidbjimg" />
      <div class="sidsbox tool tm" @click="sidsfn" ref="sidsbox">
        <img src="@/images/sids.png" alt="" class="normal" />
        <img src="@/images/sidsac.png" alt="" class="active" />
      </div>
      <div class="sidxbox tool tm" @click="sidxfn" ref="sidxbox">
        <img src="@/images/sidx.png" alt="" class="normal" />
        <img src="@/images/sidxac.png" alt="" class="active" />
      </div>
      <div class="tool gjtoolqdss" @click="sidfn">
        <img src="@/images/qd.png" alt="" class="normal" />
        <img src="@/images/qdac.png" alt="" class="active" />
        <div class="gjtoolname">确定</div>
      </div>
      <div class="sidjd">
        <div class="sidjdac" :style="{ height: heightsitpx + '%' }"></div>
      </div>
    </div>
    <!-- 调节照射视野 -->
    <!-- 调节照射视野选择题 -->
    <div class="choicebox" v-if="taskids == 555">
      <img src="@/images/choicebj.png" alt="" class="choicebj" />
      <div class="choicetitle">单选题</div>
      <div class="choicename">1、请选择合适的照射野尺寸（）</div>
      <div class="choicemain">
        <div class="choiceitem tool" @click="choiceidfn(1)">
          <img
            src="@/images/xx.png"
            alt=""
            class="normal choiceitemimg"
            v-if="choiceid != 1"
          />
          <img
            src="@/images/xxac.png"
            alt=""
            class="active choiceitemimg"
            v-if="choiceid != 1"
          />
          <img
            src="@/images/xxac.png"
            alt=""
            class="choiceitemimg"
            v-if="choiceid == 1"
          />
          <div class="choicne">10*10</div>
          <div class="choiceitemname">A</div>
        </div>
        <div class="choiceitem tool" @click="choiceidfn(2)">
          <img
            src="@/images/xx.png"
            alt=""
            class="normal choiceitemimg"
            v-if="choiceid != 2"
          />
          <img
            src="@/images/xxac.png"
            alt=""
            class="active choiceitemimg"
            v-if="choiceid != 2"
          />
          <img
            src="@/images/xxac.png"
            alt=""
            class="choiceitemimg"
            v-if="choiceid == 2"
          />
          <div class="choicne">15*15</div>
          <div class="choiceitemname">B</div>
        </div>
        <div class="choiceitem tool" @click="choiceidfn(3)">
          <img
            src="@/images/xx.png"
            alt=""
            class="normal choiceitemimg"
            v-if="choiceid != 3"
          />
          <img
            src="@/images/xxac.png"
            alt=""
            class="active choiceitemimg"
            v-if="choiceid != 3"
          />
          <div class="choicne">12*12</div>
          <img
            src="@/images/xxac.png"
            alt=""
            class="choiceitemimg"
            v-if="choiceid == 3"
          />
          <div class="choiceitemname">C</div>
        </div>
        <div class="choiceitem tool" @click="choiceidfn(4)">
          <img
            src="@/images/xx.png"
            alt=""
            class="normal choiceitemimg"
            v-if="choiceid != 4"
          />
          <img
            src="@/images/xxac.png"
            alt=""
            class="active choiceitemimg"
            v-if="choiceid != 4"
          />

          <img
            src="@/images/xxac.png"
            alt=""
            class="choiceitemimg"
            v-if="choiceid == 4"
          />
          <div class="choicne">20*20</div>
          <div class="choiceitemname">D</div>
        </div>
        <div class="choicefalse" v-if="choicetip == 1">回答错误，正确答案A</div>
        <div class="choicetrue" v-if="choicetip == 2">回答正确</div>
      </div>
      <img
        src="@/images/closexz.png"
        alt=""
        class="choiceclose"
        @click="taskid = 2"
      />
      <div class="tool gjtoolqds" v-if="choicetip == 0" @click="choicefn">
        <img src="@/images/qd.png" alt="" class="normal" />
        <img src="@/images/qdac.png" alt="" class="active" />
        <div class="gjtoolname">确定</div>
      </div>
      <div
        class="tool gjtoolqds"
        v-if="choicetip == 1 || choicetip == 2"
        @click="taskids = 5.1"
      >
        <img src="@/images/qd.png" alt="" class="normal" />
        <img src="@/images/qdac.png" alt="" class="active" />
        <div class="gjtoolname">继续</div>
      </div>
    </div>
    <!-- 调节照射视野灯 -->
    <div class="zsbox" v-if="taskids == 5.1 || taskids == 5">
      <!-- 视野窗 -->
      <div class="syqysdbox">
        <div
          class="syqysd"
          :style="{
            width: widthpx * 0.00521 + 'rem',
            height: heightpx * 0.00521 + 'rem'
          }"
        ></div>
      </div>
      <div class="mtimgbox">
        <img src="@/images/mtimg.png" alt="" class="mtimg" />
      </div>
      <div class="zsboxtj">
        <img src="@/images/zsboxtjimg.png" alt="" class="zsboxtjimg" />
        <div class="tool syjbox" @click="gj">
          <img src="@/images/syj.png" alt="" class="normal" />
          <img src="@/images/syjac.png" alt="" class="active" />
        </div>
        <div class="tool syjjbox" @click="gjj">
          <img src="@/images/syjj.png" alt="" class="normal" />
          <img src="@/images/syjjac.png" alt="" class="active" />
        </div>
        <div class="tool syjboxs" @click="kj">
          <img src="@/images/syj.png" alt="" class="normal" />
          <img src="@/images/syjac.png" alt="" class="active" />
        </div>
        <div class="tool syjjboxs" @click="kjj">
          <img src="@/images/syjj.png" alt="" class="normal" />
          <img src="@/images/syjjac.png" alt="" class="active" />
        </div>
        <!-- 旋钮 -->
        <img
          src="@/images/tzz.png"
          alt=""
          class="tzz"
          :style="{ transform: 'rotate(' + rotateds + 'deg)' }"
        />
        <img
          src="@/images/tzzs.png"
          alt=""
          class="tzzs"
          :style="{ transform: 'rotate(' + rotatedss + 'deg)' }"
        />
      </div>
      <div class="tool gjtoolqdss" @click="shiyfn">
        <img src="@/images/qd.png" alt="" class="normal" />
        <img src="@/images/qdac.png" alt="" class="active" />
        <div class="gjtoolname">确定</div>
      </div>
    </div>

    <!-- 进入控制室提示 -->
    <div class="dlbox" v-if="taskids == 6" @click="taskids = 6.1">
      <div class="dlboxname">请进入控制室进行曝光操作</div>
      <div class="tool gjtoolqdss">
        <img src="@/images/qd.png" alt="" class="normal" />
        <img src="@/images/qdac.png" alt="" class="active" />
        <div class="gjtoolname">去曝光</div>
      </div>
    </div>
    <!-- 工作站 -->
    <div class="newdnbox" v-show="taskids >= 6.2 && taskids < 7">
      <!-- 电脑框 -->
      <img src="@/images/dhk.png" alt="" class="dnk" />
      <!-- 新建患者信息 设置患者部位 -->
      <img src="@/images/newdh1.png" alt="" class="newdn1" />
      <el-input
        v-model="hzbh"
        placeholder=""
        class="hzbh"
        ref="hzbh"
      ></el-input>
      <el-input
        v-model="hzname"
        placeholder=""
        class="hzbh hzname"
        ref="hzname"
      ></el-input>
      <el-input
        v-model="jcbh"
        placeholder=""
        class="hzbh jcbh"
        ref="jcbh"
      ></el-input>
      <el-input
        v-model="jcdjh"
        placeholder=""
        class="hzbh jcdjh"
        ref="jcdjh"
      ></el-input>
      <div
        class="shangzhi tm"
        ref="shangzhi"
        v-if="taskids == 6.3"
        @click="taskids = 6.4"
      ></div>
      <div class="shangzhi2" v-if="taskids >= 6.4 && taskids < 7">上肢</div>
      <div class="jianguanj1" v-if="taskids >= 6.4 && taskids < 7">
        肩关节穿胸侧位
      </div>
      <div
        v-if="taskids >= 6.4 && taskids < 7"
        class="jianguanj2"
        :class="jianguanj2hover ? 'jianguanj2hover' : ''"
        @click=";(jianguanj2hover = true), (taskids = 6.5)"
      >
        肩关节前后位
      </div>
      <div class="tjadd tm" v-if="taskids == 6.5" @click="taskids = 6.6"></div>
      <div
        v-if="taskids == 6.6"
        class="jianguanj21"
        :class="jianguanj21hover ? 'jianguanj2hover' : ''"
        @click="jianguanj21hover = true"
      >
        肩关节前后位
      </div>
      <div
        v-if="taskids == 6.6 && !jianguanj21hover"
        class="jianguanj22 tm"
        @click="jianguanj21hover = true"
      ></div>
      <div class="huanzhe tm" v-if="jianguanj21hover" @click="taskid = 7"></div>
      <!--新建患者信息完成 -->
    </div>
    <!-- 设置曝光参数 -->
    <div
      class="newdnbox"
      v-if="(taskids == 7.1 || taskids == 7.2) && !choicehomeshow"
    >
      <!-- 电脑框 -->
      <img src="@/images/dhk.png" alt="" class="dnk" />
      <img src="@/images/newdh2.png" alt="" class="newdn1" />
      <!-- 通用闪烁外边框  从左-右 上 - 下-->
      <div class="tybox1" ref="tybox1">
        <div class="tybox1add" @click="kv += 1"><!-- 加 --></div>
        <div class="tybox1remo" @click="kv -= 1"><!-- 减 --></div>
        <el-input v-model="kv" placeholder="" class="tyboxinput"></el-input>
        <div class="tyboxdw">KV</div>
      </div>
      <div class="tybox2" ref="tybox2">
        <div class="tybox1add"><!-- 加 --></div>
        <div class="tybox1remo"><!-- 减 --></div>
        <el-input v-model="mas" placeholder="" class="tyboxinput"></el-input>
        <div class="tyboxdw">mAs</div>
      </div>
      <div class="tybox3" ref="tybox3">
        <div class="tybox1add"><!-- 加 --></div>
        <div class="tybox1remo"><!-- 减 --></div>
        <el-input v-model="ms" placeholder="" class="tyboxinput"></el-input>
        <div class="tyboxdw">ms</div>
      </div>
      <div class="tybox4" ref="tybox4">
        <div class="tybox1add"><!-- 加 --></div>
        <div class="tybox1remo"><!-- 减 --></div>
        <el-input v-model="ma" placeholder="" class="tyboxinput"> </el-input>
        <div class="tyboxdw">mA</div>
      </div>
      <!-- 保存曝光参数 -->

      <div class="bgstart" @click="bgsave">保存</div>
      <!-- 保存曝光参数完成 -->
      <!-- 通用闪烁外边框 完成 -->

      <!-- 调节曝光参数 id == 1 -->

      <!-- 调节曝光参数 id == 1 完成 -->
    </div>
    <!-- 曝光 -->
    <div
      class="newdnbox"
      v-if="
        (taskids == 8 ||
          taskids == 8.1 ||
          taskids == 8.2 ||
          taskids == 8.3 ||
          taskids == 8.4) &&
        !choicehomeshow
      "
    >
      <!-- 三个点击 -->
      <div
        class="dj1 hsmb"
        @click="xzdlfn(1)"
        ref="dh1"
        v-if="taskids == 8"
      ></div>
      <div
        class="dj2 hsmb"
        @click="xzdlfn(2)"
        ref="dh2"
        v-if="taskids == 8.2"
      ></div>
      <div
        class="dj3 hsmb"
        @click="xzdlfn(3)"
        ref="dh3"
        v-if="taskids == 8.3"
      ></div>
      <!-- 电脑框 -->
      <img src="@/images/dhk.png" alt="" class="dnk" />
      <!-- 曝光图 -->
      <img
        src="@/images/baog1.png"
        alt=""
        class="baog1"
        v-if="taskids == 8.2"
      />
      <img
        src="@/images/baog2.png"
        alt=""
        class="baog1"
        v-if="taskids == 8.3"
      />
      <img
        src="@/images/baog3.png"
        alt=""
        class="baog1"
        v-if="taskids == 8.4"
      />
      <!-- 曝光图完成 -->
      <img src="@/images/newdh2.png" alt="" class="newdn1" />
      <!-- 通用闪烁外边框  从左-右 上 - 下-->
      <div class="tybox1" ref="tybox1">
        <el-input v-model="kv" placeholder="" class="tyboxinput"></el-input>
        <div class="tyboxdw">KV</div>
      </div>
      <div class="tybox2">
        <div class="tybox1add"><!-- 加 --></div>
        <div class="tybox1remo"><!-- 减 --></div>
        <el-input v-model="mas" placeholder="" class="tyboxinput"></el-input>
        <div class="tyboxdw">mAs</div>
      </div>
      <div class="tybox3">
        <div class="tybox1add"><!-- 加 --></div>
        <div class="tybox1remo"><!-- 减 --></div>
        <el-input v-model="ms" placeholder="" class="tyboxinput"></el-input>
        <div class="tyboxdw">ms</div>
      </div>
      <div class="tybox4">
        <div class="tybox1add"><!-- 加 --></div>
        <div class="tybox1remo"><!-- 减 --></div>
        <el-input v-model="ma" placeholder="" class="tyboxinput"> </el-input>
        <div class="tyboxdw">mA</div>
      </div>
      <!-- 开始曝光 -->
      <div class="bgstart" @click="bgstart" v-if="taskids == 8.1">曝光</div>
      <div class="bgstart" @click="taskids = 9" v-if="taskids == 8.4">
        下一步
      </div>
      <div class="bgstart" @click="nextfn" v-if="taskids == 7">下一步</div>

      <!-- 曝光通用弹窗 -->
      <div class="bgtybox" v-if="bgtips">
        <div class="bgdesbox">
          {{ bgtips }}
        </div>
        <div class="tool gjtoolqdss" @click="bgqdfn">
          <img src="@/images/qd.png" alt="" class="normal" />
          <img src="@/images/qdac.png" alt="" class="active" />
          <div class="gjtoolname">确定</div>
        </div>
      </div>
      <!-- 曝光通用弹窗完成 -->
      <!-- 再次曝光提示弹窗 -->
      <div class="bgtipbox" v-if="bgtipstwo">{{ bgtipstwo }}</div>
    </div>

    <!-- 记录数值 -->
    <JLs
      v-if="taskids == 9 && !choicehomeshow"
      @tiptextfn="tiptextfn"
      @jlsfn="jlsfn"
    />
    <!-- 记录数值提示框 -->
    <div class="jlstipsbox" v-if="jlstips">
      <div class="jlstipdes">{{ jlstips }}</div>
      <div class="jlbottom">
        <!-- 是否符合要求的确定 -->
        <div class="jlbotan" @click="taskids = 9.1" v-if="taskids == 9">是</div>
        <div class="jlbotan" @click="taskids = 9.2" v-if="taskids == 9">否</div>
      </div>
    </div>
    <!-- 是否符合要求弹窗 -->
    <div class="jlstipsbox" v-if="jlstipstwo">
      <div class="jlstipdes">{{ jlstipstwo }}</div>
      <div class="jlbottom">
        <div class="jlbotan" @click="jlstipstwofn">确定</div>
      </div>
    </div>
    <!-- 最后弹出的选择项目-->

    <!-- 展示电脑连接动画 -->
    <!-- <div class="bfdhbox" v-if="taskids == 1.2">
      <bfDh :mxmtnumber="mxmtnumber" ref="bfdh" @clickItemwc="clickItemwc" />
    </div> -->
  </div>
</template>
<script>
import { mixins } from '@/mixin/index'
import { threes } from '@/mixin/three'
import headMain from '@/components/headMain.vue'
import TipText from '@/components/tipText.vue'
import WarnNi from './warnNi.vue'
import JLs from '@/components/jLs.vue'
// import bfDh from '@/components/bfDh.vue'
export default {
  name: 'WorkspaceJsonSeen',

  //混入
  mixins: [mixins, threes],

  components: { headMain, TipText, WarnNi, JLs },

  data() {
    return {
      dlarry: [],
      mxmtnumber: 'ShuJuXian.glb',
      taskid: 1,
      taskids: 1,
      choicehomeshow: false,
      id: 0,
      rotateds: 0,
      rotatedss: 0,
      heightpx: 290,
      widthpx: 270,
      heightsitpx: 50,
      gjltips: '',
      choicetip: 0,
      choiceid: 0,
      wpid: [],
      rightpx: 10,
      jbshow: false,
      jcid: 1,
      bsid: 1,
      timer: null,
      sum: 0
    }
  },

  watch: {
    taskid: {
      handler(i) {
        this.stopall()
        this.taskids = i
        this.dlarry = []
        this.move(
          [0.362, 1.539, -4.092],
          [179.24 / 180, -0.75 / 180, 179.99 / 180]
        )
        this.clearfn()
      },
      deep: true,
      immediate: true
    },
    taskids: {
      handler(i) {
        this.stopall()
        // console.log('当前taskids', i)
        this.tiptext = ''

        if (i == 1.2) {
          this.playAction('1', '1.2')
        }
        if (i == 2) {
          this.tiptext = '点击打开视野灯'
        }
        if (i == 2.1) {
          this.wtext = '视野灯已打开'
          this.timer = setTimeout(() => {
            this.wtext = ''
            this.taskid = 3
            clearTimeout(this.timer)
          }, 1000)
          this.planeTop.visible = true
          this.cylinder.visible = true
          this.planeBottom.visible = true
        }
        if (i > 2.1) {
          this.planeTop.visible = true
          this.cylinder.visible = true
          this.planeBottom.visible = true
        }
        if (i == 3) {
          this.tiptext = '将1.0mm铜板插在机头上'
          this.twinklePoint(-3, -3, -3)
          this.move(
            [-0.393, 1.822, -3.701],
            [-175.69 / 180, 2.79 / 180, 179.59 / 180]
          )
          this.playAction('2', 'tongban')
        }
        if (i == 4) {
          this.tiptext = '点击X线球管的上下按键，调节合适的SID'
        }

        if (i == 7) {
          // this.choicehomeshow = true
          this.taskids = 7.1
        }
        if (i == 5.1) {
          this.tiptext = '通过旋钮将照射野调整至合适范围'
        }

        if (i == 6.1) {
          // this.tiptext =
          //   '请输入检查数据,患者编号：20241018,患者姓名：验收测试,检查编号：20241018,登记号：20241018'
          this.tiptext = '点击电脑登录工作站'
          this.twinklePoint(-0.274, 1.652, -8.119)
          // this.move(
          //   [-0.037, 2.425, -10.326],
          //   [-152.08 / 180, 2.79 / 180, 178.52 / 180]
          // )
          this.move(
            [-0.349, 1.625, -9.427],
            [-173.4 / 180, 0.29 / 180, 179.97 / 180]
          )
        }
        if (i == 6.2) {
          // 添加黄色描边
          this.$refs.hzbh.$el.classList.add('hsmb')
          this.$refs.hzname.$el.classList.add('hsmb')
          this.$refs.jcbh.$el.classList.add('hsmb')
          this.$refs.jcdjh.$el.classList.add('hsmb')

          this.tiptext =
            '请输入检查数据,患者编号：20241018,患者姓名：验收测试,检查编号：20241018,登记号：20241018'
        }
        if (i == 6) {
          // this.tiptext =
          //   '请输入检查数据,患者编号：20241018,患者姓名：验收测试,检查编号：20241018,登记号：20241018'
        }
        if (i == 6.3) {
          this.$refs.hzbh.$el.classList.remove('hsmb')
          this.$refs.hzname.$el.classList.remove('hsmb')
          this.$refs.jcbh.$el.classList.remove('hsmb')
          this.$refs.jcdjh.$el.classList.remove('hsmb')
          this.tiptext = '点击上肢关节，选择肩关节前后位'
        }
        if (i == 6.4) {
          this.$refs.hzbh.$el.classList.remove('hsmb')
          this.$refs.hzname.$el.classList.remove('hsmb')
          this.$refs.jcbh.$el.classList.remove('hsmb')
          this.$refs.jcdjh.$el.classList.remove('hsmb')
          this.tiptext = '点击上肢关节，选择肩关节前后位'
        }
        if (i == 6.5) {
          this.tiptext = '添加肩关节前后位'
        }
        if (i == 6.6) {
          this.tiptext = '选中肩关节前后位,然后点击患者检查'
        }
        if (i == 7.1) {
          this.tiptext = '请设置KV值为70，设置完成点击下一步'
        }
        if (i == 8) {
          this.tiptext = '点击提示处电离室'
        }
        if (i == 8.1) {
          this.tiptext = '请点击曝光按钮！'
        }
        if (i == 8.2) {
          this.tiptext = '点击提示处电离室！'
        }
        if (i == 8.3) {
          this.tiptext = '点击提示处电离室！'
        }
        if (i == 8.4) {
          this.tiptext = '点击下一步'
        }
        if (i == 9.1) {
          this.jlstipstwo = '经检测该项目符合上述标准要求'
        }
        if (i == 9.2) {
          this.jlstipstwo =
            ' AEC电离室一致性检测如不合格，请及时联系DR设备厂家工程师维修，同时应核实检测设备是否经过国家计量院的校准，是否发生故障。'
        }

        // 处理两次的曝光
      },
      deep: true,
      immediate: true
    }
  },

  mounted() {},

  methods: {
    gj() {
      this.rotateds -= 5
      if (this.heightpx <= 280) {
        this.heightpx += 10
        this.rotateds -= 5
        this.theHeight += 0.1
        // this.$refs.seen.theHeight += 0.1
      }
    },
    gjj() {
      this.rotateds += 5
      if (this.heightpx >= 0) {
        if (this.heightpx >= 67) {
          this.rotateds += 5
          this.heightpx -= 10
          this.theHeight -= 0.1
        }
      }
    },
    kj() {
      if (this.widthpx <= 330) {
        this.widthpx += 10
        this.rotatedss += 5
        this.theWidth += 0.1
        // this.$refs.seen.theWidth += 0.1
      }
    },
    kjj() {
      if (this.widthpx >= 0) {
        if (this.widthpx >= 70) {
          this.rotatedss -= 5
          this.widthpx -= 10
          this.theWidth -= 0.1
        }
        // this.$refs.seen.theWidth -= 0.1
      }
    },
    // 选择检测的项目
    choicehomefn(id) {
      this.id = id
      if (this.id != 0) {
        this.choicehomeshow = false
        if (this.taskids == 7) {
          this.taskids = 7.1
        }
      }
      if (this.taskids == 999) {
        this.taskids = 7.1
        this.taskid = 7
      }
    },
    // 验证视野
    shiyfn() {
      this.taskid = 6
    },
    // 验证sidfn
    sidfn() {
      if (this.heightsitpx != 100) {
        this.gjltips = '请将SID调至100cm'
      } else {
        this.taskid = 6
      }
    },
    // 调节sid增加
    sidsfn() {
      if (this.heightsitpx < 100) {
        this.$refs.sidsbox.classList.remove('tm')
        this.heightsitpx = this.heightsitpx + 5
        this.DR7_2.position.y += 0.015
      }
    },
    sidxfn() {
      if (this.heightsitpx > 0) {
        this.$refs.sidxbox.classList.remove('tm')
        this.heightsitpx = this.heightsitpx - 5
        this.DR7_2.position.y -= 0.015
      }
    },

    choiceidfn(i) {
      if (this.choicetip == 0) {
        this.choiceid = i
      }
    },
    choicefn() {
      if (this.taskids == 5) {
        if (this.choiceid == 1) {
          this.choicetip = 2
        } else {
          this.choicetip = 1
        }
      } else {
        if (this.choiceid == 3) {
          this.choicetip = 2
        } else {
          this.choicetip = 1
        }
      }
    },
    wpqdfn() {
      this.sum = this.sum + 1
      const requiredValues = [4]
      const wpidSet = new Set(this.wpid) // 将数组转换为 Set 以便于查找
      const requiredSet = new Set(requiredValues)

      // 判断 wpid 是否只包含 1, 2, 3 且没有多余的元素
      if (
        wpidSet.size === requiredSet.size &&
        [...requiredSet].every((val) => wpidSet.has(val))
      ) {
        this.gjltips = '回答正确'
        this.timer = setTimeout(() => {
          this.gjltips = ''
          this.taskid = 3
          clearTimeout(this.timer)
        }, 1000)
      } else {
        this.gjltips = '回答错误'
        this.timer = setTimeout(() => {
          this.gjltips = ''
          clearTimeout(this.timer)
          this.wpid = []
          this.$nextTick(() => {
            if (this.$refs['normalImg4']) {
              this.$refs['normalImg4'][0].classList.add('tm')
            }
          })
        }, 1000)
        if (this.sum >= 3) {
          this.wpid = [4]
        }
      }
    },

    wpidfn(i) {
      // 检查数组中是否已存在相同的元素
      const index = this.wpid.indexOf(i)
      // 如果存在相同的元素，先删除它
      if (index !== -1) {
        this.wpid.splice(index, 1)
        return
      }
      // 然后再将元素添加到数组中
      this.wpid.push(i)
    },
    ycfns() {
      if (this.rightpx == -900) {
        this.rightpx = 10
      }
    },
    ycfn() {
      if (this.rightpx == 10) {
        this.rightpx = -900
      }
    },
    jbshowfn() {
      this.$nextTick(() => {
        this.jbshow = !this.jbshow
      })
    },
    qhfn(item) {
      const foundindex = this.jboxdata.findIndex(
        (data) => data.bsid == item.bsid
      )
      if (foundindex !== -1) {
        // 交换 bsid 和 name 的值
        const tempBsid = this.jboxdata[foundindex].bsid
        const tempName = this.jboxdata[foundindex].name
        // 把找到的项替换为第一个项的值
        this.jboxdata[foundindex].bsid = this.jboxdata[0].bsid
        this.jboxdata[foundindex].name = this.jboxdata[0].name
        this.bsid = item.bsid
        // 把第一个项替换为目标项的值
        this.jboxdata[0].bsid = tempBsid
        this.jboxdata[0].name = tempName
      } else {
        console.log('未找到匹配的项')
      }
    },
    clickItem(i) {
      if (i == 1.2) {
        this.taskids = 1.3
      }
      if (i == 'tongban') {
        this.taskid = 4
      }
    },
    xzdlfn(i) {
      if (!this.dlarry.includes(i)) {
        const refEl = this.$refs['dh' + i]

        if (refEl) {
          refEl.classList.remove('hsmb')
        }
        if (i == 1) {
          this.taskids = 8.1
        } else {
          this.dlarry.push(i)
        }
        if (i == 2) {
          this.taskids = 8.3
        }
      }

      // 当 this.dlarry 长度达到 3 时，修改 taskid
      if (this.dlarry.length === 2) {
        this.taskids = 8.4
      }
    },
    nextfn() {
      if (this.kv != 70) {
        this.wtext = '请设置KV为70'
      }
    },
    // 报错曝光
    bgsave() {
      if (this.kv == 70) {
        this.taskid = 8
      } else {
        // 提示输入错误的曝光
        this.wtext = '输入错误'
        this.$refs.tybox1.classList.add('tymb')
        this.timer = setTimeout(() => {
          this.$refs.tybox1.classList.remove('tymb')
          this.wtext = ''
          clearTimeout(this.timer)
        }, 1000)
      }
    },
    tiptextfn(i) {
      this.tiptext = i
    }
  }
}
</script>

<style scoped>
.dd {
  height: 100%;
  width: 100%;
}
.bgstart {
  position: absolute;
  right: 150px;
  bottom: 85px;
  cursor: pointer;
  width: 100px;
  height: 45px;
  background: linear-gradient(360deg, #ff6a38 0%, #ff9c49 100%);
  box-shadow: 0px 2px 0px 0px #482315,
    inset 0px 6px 3px 0px rgba(255, 255, 255, 0.5);
  border-radius: 5px;
  border: 1px solid #ffbb4f;
  color: #ffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  cursor: pointer;
}
.baog1 {
  width: 575px;
  height: 630px;
  position: absolute;
  top: 80px;
  left: 280px;
  z-index: 9;
}
</style>
